Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: allow rendering all options inside list box for better screen reader experience #805

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

GrigorM
Copy link

@GrigorM GrigorM commented Aug 1, 2022

Currently only the active item and the adjacent ones are rendered inside [role="listbox"]. This is problematic for screen readers, because they will announce an item as "Option 2 of 3" (3 options in total, current one is second), when it might be option 5 of 10. To fix this, all the options must be present inside [role="listbox"], so that screen readers know the full length of options and the position of the current one.

Not sure why it is implemented the way it is now, so I added the feature as an optional prop, although i think this should be the default way it works.

@vercel
Copy link

vercel bot commented Aug 1, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
select ✅ Ready (Inspect) Visit Preview Sep 1, 2022 at 4:27PM (UTC)

@GrigorM GrigorM changed the title feat: allow rendering all options inside list box for better screen reader experience fix: allow rendering all options inside list box for better screen reader experience Nov 7, 2022
@GrigorM
Copy link
Author

GrigorM commented Nov 7, 2022

Closes #852

@vitosamson
Copy link

would also really like to see this merged as the current behavior makes it very difficult to write tests against the options that are rendered using RTL's screen.getByRole('option')

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants